<template>
	<view>
		<view class="avatar">
			<view class="avatar_img"><image :src="info.avatar"></image></view>
			<view class="avatar_name">{{info.realname}}</view>
		</view>
		<view class="application">
			<view class="list">
				<view class="application_title">所属部门</view>
				<view class="application_name">{{info.department}}</view>
			</view>
			<view class="list">
				<view class="application_title">职位(岗位)</view>
				<view class="application_name">{{info.position}}</view>
			</view>
			<view class="list">
				<view class="application_title">手机号</view>
				<view class="application_name">{{info.mobile}}</view>
			</view>
		</view>
		<view class="binding">
			<view @click="review(1)">同意申请</view>
			<view @click="review(2)">拒接申请</view>
		</view>
	</view>
</template>

<script>

export default {
    data() {
        return {
            id:0,
            info:{}
        }
    },
    onLoad(e) {
        this.id = e.id
        this.load()
    },
    methods:{
        load: async function() {
            let res = await this.$api.staffReviewInfo({id: this.id});
            if (!res.code) {
                this.$u.toast(res.msg);
                return;
            }
            this.info = res.data;
        },
        async review(status){
            let res = await this.$api.reviewStaff({
                id: this.id, status
            });
            this.$u.toast(res.msg);
            if (res.code != 1) {
                return;
            }
            uni.navigateBack();

        },
    }
}
</script>

<style lang="less" scoped>
	.avatar{
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		justify-content: center;
		padding: 56rpx 0;
		.avatar_img{
			width: 176rpx;
			height: 176rpx;
			border-radius: 100%;
			overflow: hidden;
			margin-bottom: 20rpx;
			image{
				width: 100%;
				height: 100%;
				display: block;
			}
		}
		.avatar_name{
			width: 100%;
			font-size: 32rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			color: #010101;
			line-height: 58rpx;
			text-align: center;
		}
	}
	.application{
		padding: 0 32rpx;
		.list{
			padding: 40rpx 0;
			border-bottom: 2rpx solid #D9D9D9;
			.application_title{
				font-size: 28rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #767879;
				line-height: 28rpx;
				margin-bottom: 16rpx;
			}
			.application_name{
				font-size: 28rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 400;
				color: #010101;
				line-height: 28rpx;
			}
			&:last-child{
				border-bottom: none;
			}
		}
	}
	.binding{
		position: fixed;
		bottom: 132rpx;
		left: 0;
		right: 0;
		padding: 0 48rpx;
		display: flex;
		view{
			flex: 1;
			line-height: 88rpx;
			border-radius: 44rpx 44rpx 44rpx 44rpx;
			border: 2rpx solid #24458E;
			font-size: 32rpx;
			font-family: PingFang SC, PingFang SC;
			font-weight: 400;
			text-align: center;
			&:first-child{
				background: #24458E;
				border-color: #24458E;
				color: #FFFFFF;
				margin-right: 30rpx;
			}
			&:last-child{
				border-color: #010101;
				background: #fff;
				color: #010101;
			}
		}
	}
	
</style>